import React, { PureComponent } from 'react';
import { Table, Card, Button, Divider, Popconfirm, Icon, message,Form,DatePicker,Select } from 'antd';
import moment from 'moment';
import { connect } from 'dva';
import router from 'umi/router';
import styles from '../../../Repair.less';
import EmergAddEquip from './EmergAddEquip';
import { baseUrl } from '../../../../../services/baseUrl';
import { getAuthority } from '@/utils/authority';
import RenderAuthorized from '@/components/Authorized';
const Authorized = RenderAuthorized(getAuthority());
const FormItem = Form.Item;
const Option = Select.Option;
@Form.create()
@connect(({ emergency, loading, global,assessment }) => ({
    currentUrl: global.currentUrl,
    elementAuth: global.elementAuth,
    EquipList: emergency.EquipList,
    loading: loading.effects['emergency/fetchQueryEquipList'],
    companyList: assessment.companyList,
}))

class EmergEquip extends PureComponent {
    constructor(props) {
        super(props);

        this.state = {
        };

        this.dispatch = this.props.dispatch;
    }
    returnColumn = () => {
        return [
            {
                title: '序号',
                dataIndex: 'Id',
                render: (text, record, index) => `${index + 1}`,
                width: 50,

            },
            {
                title: '人员表名称',
                width: 400,
                key: 'zbbmc',
                dataIndex: 'zbbmc',


            },
            {
                title: '建设单位',
                key: 'jsbmmc',
                dataIndex: 'jsbmmc',


            },
            {
                title: '操作',
                key: 'action',
                fixed: 'right',
                width: 600,
                render: (text, record) =>
                    <>
                        {/* <a href="javascrips:;" onClick={() => {
                            // router.push({ pathname: '/municipal/repair/desc', state: { record: record } });
                        }}>

                            <Icon type="book" />
                            查看
                      </a>
                        <Divider type="vertical" /> */}
                        <Authorized authority={this.props.elementAuth['download']}>
                            <a href="javascrips:;" onClick={() => {

                                window.open(`${baseUrl}/Emergency/ExportEquipToExcel/${record.id}`);
                            }}>

                                <Icon type="export" />
                                导出
                      </a></Authorized>
                        <Divider type="vertical" />
                        {record.sfth == 2 && <>
                            <Authorized authority={this.props.elementAuth['addPerson']}>
                                <a href="javascrips:;" onClick={() => {
                                    router.push({ pathname: `/municipal/emergency/addCar/${record.id}` });
                                }}>
                                    <Icon type="edit" />
                                    增加车辆信息
                      </a></Authorized>
                            <Divider type="vertical" /></>
                        }
                                                {record.sfth == 2 && <>
                            <Authorized authority={this.props.elementAuth['addPerson']}>
                                <a href="javascrips:;" onClick={() => {
                                    router.push({ pathname: `/municipal/emergency/addOther/${record.id}` });
                                }}>
                                    <Icon type="edit" />
                                    增加其他信息
                      </a></Authorized>
                            <Divider type="vertical" /></>
                        }
                        {record.sfth == 2 && <>
                            <Authorized authority={this.props.elementAuth['edit']}>
                                <a href="javascrips:;" onClick={() => {
                                    router.push({ pathname: `/municipal/emergency/editEquip/${record.id}` });
                                }}>

                                    <Icon type="edit" />
                                    编辑
                      </a></Authorized>
                            <Divider type="vertical" /></>
                        }
                        {record.sfth == 2 && <>
                            <Authorized authority={this.props.elementAuth['finishEdit']}>
                                <a href="javascrips:;" onClick={() => {
                                    this.changeStatus({ id: record.id, status: 1 });
                                }}>
                                    <Icon type="edit" />
                                    完成编辑
                      </a></Authorized>
                            <Divider type="vertical" /></>
                        }
                        {record.sfth == 1 && <>
                            <Authorized authority={this.props.elementAuth['editRollBack']}>
                                <a href="javascrips:;" onClick={() => {
                                    this.changeStatus({ id: record.id, status: 2 });
                                }}>
                                    <Icon type="rollback" />
                                    退回编辑
                      </a></Authorized>
                            <Divider type="vertical" /></>
                        }
                        <Authorized authority={this.props.elementAuth['delete']}>
                        <Popconfirm title="确定删除?" onConfirm={this.handleDelete.bind(this, record)}>
                            <a href="javascript:;">
                                <Icon type="delete" />
                                删除
                        </a>
                        </Popconfirm></Authorized>
                    </>
            }
        ];
    }
    changeStatus = ({ id = null, status = null } = {}) => {
        const hide = message.loading('正在修改...', 0);
        this.dispatch({
            type: 'emergency/fetchEmergencyCommitEquipStatus',
            payload: {
                id: id,
                sfth: status
            },
            callback: response => {
                hide();
                if (response.status) {
                    message.success('修改成功');
                    this.fetchQueryEquipList();
                } else {
                    message.error('修改失败');
                    console.log(response.ErrorMessage);
                }
            },
        });
    };
    fetchQueryEquipList = ({ company = null,begintime=null,endtime=null } = {}) => {
        this.dispatch({
            type: 'emergency/fetchQueryEquipList',
            payload: {
                company: company,
                begintime:begintime,
                endtime:endtime
            },
            callback: response => {
                if (response.ErrorMessage) {
                    message.error.error('获取列表单失败');
                    console.log(response.ErrorMessage);
                }
            },
        });
    };
    resetData = () => {
        this.props.form.resetFields();
        this.fetchQueryEquipList();
      }
    queryList=()=>{
        this.props.form.validateFields((err, values) => {
            if (!err) {
                values.begintime = values.begintime && moment(values.begintime).format('YYYY-MM-DD');
                values.endtime = values.endtime && moment(values.endtime).format('YYYY-MM-DD');
                this.fetchQueryEquipList(values);
            }
        })
        
    }
    OnRef = ({ ref = null, type = null } = {}) => {

        this[type] = ref;

    }
    handleDelete = (record) => {
        const hide = message.loading('正在删除...', 0);
        this.dispatch({
            type: 'emergency/fetchEmergencyDeleteEquip',
            payload: {
                id: record.id,
            },
            callback: response => {
                hide();
                if (response.status) {
                    message.success('删除成功');
                    // this.setState({ visible: false });
                    this.fetchQueryEquipList();
                } else {
                    message.error('删除失败');
                    console.log(response.ErrorMessage);
                }
            },
        });

    }
    componentDidMount = () => {

        !this.props.EquipList && this.fetchQueryEquipList();
    }
    render() {
        const { getFieldDecorator } = this.props.form;
        const { EquipList, loading,elementAuth,companyList } = this.props
        return (
            <>
                <Card style={{ margin: '10px' }}> 
                
                <Form layout="inline">
            <Authorized authority={elementAuth['selectOrg']}>
              <FormItem label="养护单位">
                {getFieldDecorator('company', { initialValue: null })(
                  <Select  style={{ width: '200px' }} >
                    {companyList
                      && companyList.map(item =>
                        <Option key={item.Id} value={item.Id}>
                          {item.Name}
                        </Option>
                      )}
                  </Select>
                )}
              </FormItem></Authorized>
              <FormItem label="起始时间">
              {getFieldDecorator('begintime', { initialValue: null })(
                <DatePicker
                  placeholder="起始时间"
                  style={{ width: '200px' }}
                  format={'YYYY-MM-DD'}
                />
              )}
            </FormItem>
            <FormItem label="截止时间">
              {getFieldDecorator('endtime', { initialValue: null })(
                <DatePicker
                  placeholder="截止时间"
                  style={{ width: '200px' }}
                  format={'YYYY-MM-DD'}
                />
              )}
            </FormItem>
            <FormItem>
              <Button type="primary" onClick={this.queryList}>
                查询
              </Button>
            </FormItem>
            <FormItem>
              <Button onClick={this.resetData}>重置</Button>
            </FormItem> 
                <Authorized authority={elementAuth['add']}>  <FormItem><Button
                    type="primary"
                    onClick={() => {
                        this["AddForm"].setState({ visible: true });
                    }}
                >
                    新增
                </Button> </FormItem></Authorized></Form>
                </Card>
                <Card
                    title={
                        <span style={{ borderLeft: '4px solid #3CB371', paddingLeft: '10px' }}>
                            嘉兴市级反恐应急处置力量最小作战单元装备表
            </span>
                    }
                    style={{ margin: '10px' }}
                >          <Table
                        className={styles.RepairTable}
                        size="small"
                        align={'center'}
                        loading={loading}
                        bordered
                        dataSource={EquipList}
                        columns={this.returnColumn()}

                    />
                    <EmergAddEquip OnRef={this.OnRef} fetchQueryEquipList={this.fetchQueryEquipList} />
                </Card>
            </>

        );

    }


}

export default EmergEquip;